<template>
    <div style="display: inline-block;">
        <el-dialog v-model="open" title="公式说明" width="800px" append-to-body @close="close">
            <p></p>
            <!-- 梁柱说明 -->
            <div v-if="title == 'zhu'">
                <h3>一、框架为强梁弱柱型框架柱</h3>
                <p>屈服弯矩按照下述几种形式进行计算：</p>
                <p></p>
                <!-- 第一 -->
                <span class="index-part" v-html="indexIcon(0)"></span>
                <Formula font-size="20px" :option="[
                    { content: 'N', skew: '-15deg', sub: 'max', },
                    { content: '&gt=', margin: '0 4px' },
                    { content: 'N', skew: '-15deg' },
                    { content: '>', margin: '0 4px' },
                    { content: '0.46bhf', skew: '-15deg', sub: 'ck' },
                ]"></Formula>
                <!-- 公式 -->
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'M', sub: 'Z' },
                    { content: '=', margin: '0 8px' },
                    { content: '(0.8A', sub: 'S' },
                    { content: 'f', skew: '-15deg', sub: 'yk' },
                    { content: 'h' },
                    { content: '+', margin: '0 8px' },
                    { content: '0.12bh', super: '2' },
                    { content: 'f', skew: '-15deg', sub: 'ck' },
                    { content: ')', margin: '0 8px 0 0' },
                    {
                        rows: [
                            [
                                { content: 'N', sub: 'max' },
                                { content: '-', margin: '0 8px' },
                                { content: 'N' },
                            ],
                            [
                                { content: 'N', sub: 'max' },
                                { content: '-', margin: '0 8px' },
                                { content: '0.46bhf', skew: '-15deg', sub: 'ck' },
                            ]
                        ]
                    },
                ]">
                </MultilineFormula>
                <!-- 第二 -->
                <span class="index-part" v-html="indexIcon(1)"></span>
                <Formula font-size="20px" :option="[
                    { content: '0.46bhf', skew: '-15deg', sub: 'ck' },
                    { content: '>=', margin: '0 4px' },
                    { content: 'N', skew: '-15deg' },
                    { content: '>', margin: '0 4px' },
                    { content: '0' },
                ]"></Formula>
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'M', sub: 'Z' },
                    { content: '=', margin: '0 8px' },
                    { content: '0.8A', sub: 'S' },
                    { content: 'f', skew: '-15deg', sub: 'yk' },
                    { content: 'h' },
                    { content: '+', margin: '0 8px' },
                    { content: '0.5Nh(1' },
                    { content: '-', margin: '0 8px' },
                    { content: 'N | bhf', skew: '-15deg', sub: 'ck' },
                    { content: ')' },
                ]">
                </MultilineFormula>
                <!-- 第三 -->
                <span class="index-part" v-html="indexIcon(2)" style="margin-top: 20px;display: inline-block;"></span>
                <Formula font-size="20px" :option="[
                    { content: '0' },
                    { content: '>=', margin: '0 4px' },
                    { content: 'N', skew: '-15deg' },
                    { content: '>', margin: '0 4px' },
                    { content: 'N', margin: '0 2px 0 0', sub: 'min' },
                ]"></Formula>
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'M', sub: 'Z' },
                    { content: '=', margin: '0 8px' },
                    { content: '0.8A', sub: 'S' },
                    { content: 'f', skew: '-15deg', sub: 'yk' },
                    { content: 'h' },
                    { content: '+', margin: '0 8px' },
                    { content: '0.4Nh' },
                ]">
                </MultilineFormula>
                <p>式中，</p>
                <Formula font-size="20px" :option="[
                    { content: 'N', skew: '-15deg', sub: 'max', },
                    { content: '=', margin: '0 8px' },
                    { content: 'bhf', skew: '-15deg', sub: 'ck' },
                    { content: '+', margin: '0 8px' },
                    { content: '(A', sub: 'S' },
                    { content: '+', margin: '0 8px' },
                    { content: 'A', super: '`', sub: 'S' },
                    { content: ')' },
                    { content: 'f', skew: '-15deg', super: '`', sub: 'yk' },
                ]"></Formula><br>
                <Formula font-size="20px" :option="[
                    { content: 'N', skew: '-15deg', sub: 'min', },
                    { content: '=', margin: '0 8px' },
                    { content: '(A', sub: 'S' },
                    { content: '+', margin: '0 8px' },
                    { content: 'A', super: '`', sub: 'S' },
                    { content: ')' },
                    { content: 'f', skew: '-15deg', sub: 'yk' },
                ]"></Formula>

                <h3>二、框架为对称配筋矩形截面偏压柱</h3>
                <p>现有受弯承载力可按下列公式计算：</p>
                <Formula font-size="20px" :option="[
                    { content: '当' },
                    { content: 'N', skew: '-15deg' },
                    { content: '<=', margin: '0 4px' },
                    { content: 'ξ', sub: 'bk' },
                    { content: 'f', skew: '-15deg', sub: 'cmk' },
                    { content: 'bh', skew: '-15deg', sub: '0' },
                    { content: '时，' },
                ]"></Formula>
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'M', sub: 'cy' },
                    { content: '=', margin: '0 8px' },
                    { content: 'f', skew: '-15deg', sub: 'yk' },
                    { content: 'A', sub: 'S' },
                    { content: '(h', sub: '0' },
                    { content: '-', margin: '0 8px' },
                    { content: 'a', super: '、', sub: 'S' },
                    { content: ')+', margin: '0 8px' },
                    { content: '0.5Nh(1' },
                    { content: '-', margin: '0 8px' },
                    { content: 'N | bhf', skew: '-15deg' },
                    { content: ')' },
                ]">
                </MultilineFormula>
                <p></p>
                <Formula font-size="20px" :option="[
                    { content: '当' },
                    { content: 'N', skew: '-15deg' },
                    { content: '>', margin: '0 4px' },
                    { content: 'ξ', sub: 'bk' },
                    { content: 'f', skew: '-15deg', sub: 'cmk' },
                    { content: 'bh', skew: '-15deg', sub: '0' },
                    { content: '时，' },
                ]"></Formula>
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'M', sub: 'cy' },
                    { content: '=', margin: '0 8px' },
                    { content: 'f', skew: '-15deg', sub: 'yk' },
                    { content: 'A', sub: 'S' },
                    { content: '(h', sub: '0' },
                    { content: '-', margin: '0 8px' },
                    { content: 'a', super: '、', sub: 'S' },
                    { content: ')+', margin: '0 8px' },
                    { content: 'ξ(1-0.5ξ)' },
                    { content: 'f', skew: '-15deg', sub: 'cmk' },
                    { content: 'bh', skew: '-15deg', super: '2', sub: '0' },
                    { content: '-', margin: '0 8px' },
                    { content: 'N(0.5h' },
                    { content: '-', margin: '0 4px' },
                    { content: 'a', super: '、', sub: 'S' },
                    { content: ')' },
                ]">
                </MultilineFormula>
                <p></p>
                <Formula font-size="20px" :option="[
                    { content: '其中，', margin: '0 10px 0 0' },
                    { content: 'ξ', },
                    { content: '=', margin: '0 4px' },
                    { content: '[(ξ', sub: 'bk' },
                    { content: '-', margin: '0 4px' },
                    { content: '0.8)N' },
                    { content: '-', margin: '0 4px' },
                    { content: 'ξ', sub: 'bk' },
                    { content: 'f', skew: '-15deg', sub: 'yk' },
                    { content: 'A', skew: '-15deg', sub: 's' },
                    { content: ']/[(ξ', sub: 'bk' },
                    { content: '-', margin: '0 4px' },
                    { content: '0.8)' },
                    { content: 'f', skew: '-15deg', sub: 'cmk' },
                    { content: 'bh', skew: '-15deg', sub: '0' },
                    { content: '-', margin: '0 4px' },
                    { content: 'f', skew: '-15deg', sub: 'yk' },
                    { content: 'A', skew: '-15deg', sub: 's' },
                    { content: ']' },
                ]"></Formula>
                <p>其中，</p>
                <p>N—对应于重力荷载代表值的柱轴向压力；</p>
                <p>A<sub>s</sub>—柱实有纵向受拉钢筋截面面积；</p>
                <p>f<sub>yk</sub>—现有钢筋抗拉强度标准值；</p>
                <p>f<sub>cmk</sub>—现有混凝土弯曲抗压强度标准值；</p>
                <p>f<sub>ck</sub>—现有混凝土抗压强度标准值；</p>
                <p>a <super>'</super><sub>s</sub>—受压钢筋合理点至受压边缘的距离；</p>
                <p>ξ<sub>bk</sub>—相对界限受压区高度，HPB级钢筋取0.6，HRB级钢筋取0.55；</p>
                <p>b、h、h<sub>0</sub>—验算方向的截面宽、高和截面有效高度。</p>

                <h3> 三、框架为对称配筋矩形截面偏压柱</h3>
                <p>
                    <span> 梁端先发生屈服,</span>
                    <Formula font-size="24px" :option="[
                        { content: 'M', super: 'U', sub: 'cy' },
                    ]"></Formula>
                    <span>和</span>
                    <Formula font-size="24px" :option="[
                        { content: 'M', super: 'L', sub: 'cy' },
                    ]"></Formula>
                    <span>由下式代替：</span>
                </p>
                <div style="display: flex;justify-content: center;">
                    <MultilineFormula display="block" tagOffset="-6px" fontSize="20px" :option="[
                        { content: 'M', super: 'U', sub: 'cy' },
                        { content: '=', margin: '0 8px' },
                        { content: '∑' },
                        { content: 'M', super: 'U', sub: 'by' },
                        {
                            rows: [
                                [{ content: 'K', sub: 'i' }],
                                [
                                    { content: 'K', sub: 'i' },
                                    { content: '+' },
                                    { content: 'K', sub: 'i+1' },
                                ]
                            ]
                        },
                    ]">
                    </MultilineFormula>
                    <p style="width:50px"></p>
                    <MultilineFormula display="block" tagOffset="-6px" fontSize="20px" :option="[
                        { content: 'M', super: 'L', sub: 'cy' },
                        { content: '=', margin: '0 8px' },
                        { content: '∑' },
                        { content: 'M', super: 'L', sub: 'by' },
                        {
                            rows: [
                                [{ content: 'K', sub: 'i' }],
                                [
                                    { content: 'K', sub: 'i' },
                                    { content: '+' },
                                    { content: 'K', sub: 'i-1' },
                                ]
                            ]
                        },
                    ]">
                    </MultilineFormula>
                </div>
                <p>
                    <span>节点左、右梁端顺时针或者逆时针方向计算得到截面钢筋屈服后弯矩之和，取其中的较小值 ，梁端屈服弯矩。</span>
                    <Formula font-size="22px" :option="[
                        { content: 'M', sub: 'by' },
                        { content: '=', mergin: '0 4px' },
                        { content: '0.9', },
                        { content: 'A', skew: '-15deg', sub: 's' },
                        { content: 'f', skew: '-15deg', sub: 'yk' },
                        { content: 'h', sub: '1' },
                    ]"></Formula>
                    <span>其中，</span>
                    <MultilineFormula display="inline-block" tagOffset="-6px" fontSize="20px" :option="[
                        { content: 'i' },
                        { content: '=', mergin: '0 4px' },
                        {
                            rows: [
                                [{ content: 'EI', }],
                                [{ content: 'l', sub: '0' },]
                            ]
                        },
                    ]">
                    </MultilineFormula>
                    <span>,l<sub>0</sub>为梁计算长度，h<sub>1</sub>梁有效高度，Ki用柱刚度计算公式（边柱情况下，式中i<sub>1</sub>，i<sub>3</sub>
                        取0值）：</span>
                </p>
                <p>
                    <span>一般楼层</span>
                    <MultilineFormula display="inline-block" tagOffset="-6px" fontSize="20px" :option="[
                        { content: 'K', sub: 'i' },
                        { content: '=', mergin: '0 4px' },
                        {
                            rows: [
                                [
                                    { content: 'i', sub: '1' },
                                    { content: '+', mergin: '0 4px' },
                                    { content: 'i', sub: '2' },
                                    { content: '+', mergin: '0 4px' },
                                    { content: 'i', sub: '3' },
                                ],
                                [{ content: '2i', sub: 'c' },]
                            ]
                        },
                    ]">
                    </MultilineFormula>
                    <span>，底层柱</span>
                    <MultilineFormula display="inline-block" tagOffset="-6px" fontSize="20px" :option="[
                        { content: 'K', sub: 'i' },
                        { content: '=', mergin: '0 4px' },
                        {
                            rows: [
                                [
                                    { content: 'i', sub: '1' },
                                    { content: '+', mergin: '0 4px' },
                                    { content: 'i', sub: '2' },
                                ],
                                [{ content: 'i', sub: 'c' },]
                            ]
                        },
                    ]">
                    </MultilineFormula>
                </p>
            </div>
            <div v-if="title == 'tcq'">
                <p></p>
                <p>
                    <span>砖填充墙钢筋混凝土框架结构的层间现有受剪承载力</span>
                    <Formula color="#333" font-size="20px" fontWeight="400" letterSpacing="0" :option="[
                        { content: '∑', },
                        { content: 'Q', left: '-2px' },
                        { content: 'mzi', scale: 0.5, position: 'bottom', left: '-10px' },
                    ]"></Formula>
                    <span>，按照如下公式计算：</span>
                </p>
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'Q', sub: 'my' },
                    { content: '=', margin: '0 8px' },
                    { content: 'ζ', sub: 'N' },
                    { content: 'f', skew: '-15deg', sub: 'vk' },
                    { content: 'A', sub: 'm' },
                ]">
                </MultilineFormula>
                <p>其中：</p>
                <p>ζ<sub>N</sub>—砌体强度的正压力影响系数，即σ0=h/b，其中h为填充墙高度，b为填充墙截面宽度；</p>
                <p>f<sub>vk</sub>—砖墙的抗剪强度标准值，请参见易损性模型库模块-钢筋混凝土结构相关系数中的”砌体非抗震设计的抗剪强度标准值“表；</p>
                <p>A<sub>m</sub>—砖填充墙水平截面面积，可不计入宽度小于洞口高度1/4的墙肢，<Formula color="#333" font-size="16px" fontWeight="400"
                        letterSpacing="0" :option="[
                            { content: 'A', sub: 'm' },
                            { content: '=', margin: '0 0.2' },
                            { content: 'b' },
                            { content: '*', margin: '0 0.2' },
                            { content: 't' },
                        ]"></Formula> 其中b为填充墙截面宽度，t为填充墙厚度。</p>
            </div>
            <div v-if="title == 'jlq'">
                <p></p>
                <p>
                    <span>带边框柱的钢筋混凝土抗震墙的层间现有受剪承载力</span>
                    <Formula color="#333" font-size="20px" fontWeight="400" letterSpacing="0" :option="[
                        { content: '∑', },
                        { content: 'Q', left: '-2px' },
                        { content: 'wzi', scale: 0.5, position: 'bottom', left: '-10px' },
                    ]"></Formula>
                    <span>，按照如下公式计算：</span>
                </p>
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'Q', sub: 'wy' },
                    { content: '=', margin: '0 8px' },
                    {
                        rows: [
                            [
                                { content: '1' },
                            ],
                            [
                                { content: 'λ' },
                                { content: '-', margin: '0 8px' },
                                { content: '0.5' },
                            ],

                        ]
                    },
                    { content: '(O.4', margin: '0 0 0.4 0' },
                    { content: 'f', skew: '-15deg', sub: 'ck' },
                    { content: 'A', sub: 'w' },
                    { content: '+', margin: '0 8px' },
                    { content: 'O.1N)', margin: '0 0 0.4 0' },
                    { content: '+', margin: '0 8px' },
                    { content: '0.8' },
                    { content: 'f', skew: '-15deg', sub: 'yvk' },
                    {
                        rows: [
                            [{ content: 'A', sub: 'sh' },],
                            [{ content: 's' },],
                        ]
                    },
                    { content: 'h', sub: '0' },
                ]">
                </MultilineFormula>
                <p>其中：</p>
                <p>f<sub>ck</sub>—钢筋混凝土强度等级；</p>
                <p>A<sub>w</sub>—抗震墙的截面积；</p>
                <p>N—对应于重力荷载代表值的柱轴向压力，当N>0.2f<sub>ck</sub>A<sub>w</sub>时，取N=0.2f<sub>ck</sub>A<sub>w</sub>；</p>
                <p>f<sub>yvk</sub>—剪力墙箍筋标准值；</p>
                <p>A<sub>sh</sub>—配置在同一水平截面内的水平钢筋截面面积（不填则计为0）；</p>
                <p>S<sub>2</sub>—剪力墙水平向钢筋间距；</p>
                <p>λ—抗震墙的计算剪跨比；其值可采用计算楼层至该抗震墙顶的1/2高度与抗震墙截面高度之比，当小于1.5时取1.5，当大于2.2时取2.2。</p>
            </div>
            <div v-if="title == 'jljs'">
                <p></p>
                <p>
                    <span>第i层的地震剪力</span>
                    <Formula color="#333" font-size="20px" fontWeight="400" letterSpacing="0" :option="[
                        { content: 'Q', left: '-2px' },
                        { content: 'mi', scale: 0.5, position: 'bottom', left: '-10px' },
                    ]"></Formula>
                    <span>,</span>
                </p>
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'Q', sub: 'mi' },
                    { content: '=', margin: '0 8px' },
                    {
                        rows: [
                            [
                                { content: 'G', sub: 'i' },
                                { content: 'H', sub: 'i' },
                            ],
                            [
                                { content: '∑', topContent: 'n', bottomContent: 'i=1' },
                                { content: 'G', sub: 'j' },
                                { content: 'G', sub: 'j' },
                            ],

                        ]
                    },
                    { content: '(1' },
                    { content: '-', margin: '0 8px' },
                    { content: 'δ', skew: '-15deg', sub: 'n' },
                    { content: ')' },
                    { content: 'Q', sub: 'Ek' },
                ]">
                </MultilineFormula>
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'Q', sub: 'Ek' },
                    { content: '=', margin: '0 8px' },
                    { content: '0.8α1' },
                    { content: 'G', sub: 'E' },
                ]">
                </MultilineFormula>
                <MultilineFormula display="block" tagOffset="-6px" fontSize="24px" :option="[
                    { content: 'G', sub: 'E' },
                    { content: '=', margin: '0 8px' },
                    { content: '∑', topContent: 'n', bottomContent: 'i=1' },
                    { content: 'G', sub: 'i' },
                ]">
                </MultilineFormula>
                <p>其中：</p>
                <p>G<sub>i</sub>—第i层重力，应包括结构自重和50%的活荷载；</p>
                <p>H<sub>i</sub>—第i层楼板离地面高度；</p>
                <p>α1— 结构基本自振周期T1的地震影响系数，由抗震规范反应谱曲线计算；</p>
                <p>δ<sub>n</sub>—顶点附加地震作用系数。</p>
            </div>
            <div v-if="title == 'yslpjz'">
                <p></p>
                <p>
                    <span>楼层最大延伸率的平均值</span>
                    <Formula font-size="20px" :option="[
                        { content: 'μ', topContent: '_', tagLineHeight: '0.3', top: '-3px', sub: 'i' },
                    ]"></Formula>
                    <span>公式，其中</span>
                </p>
                <p>i—楼层序号；</p>
                <p>C<sub>k</sub>—修正系数，请参见易损性模型库模块-钢筋混凝土结构相关系数中的”钢筋混凝土结构房屋修正系数Ci值“表。</p>
            </div>
            <div v-if="title == 'ci'">
                <h3 style="text-align: center;">钢筋混凝土结构房屋修正系数Ci值</h3>
                <el-table class="listTable" ref="table9Ref" border :data="tableList"
                    :cell-style="{ border: '1px solid #FaFaFa' }"
                    :header-cell-style="{ border: '1px solid #FaFaFa', borderLeft: 'none', borderTop: 'none' }">
                    <el-table-column label="条件" header-align="center" align="center">
                        <el-table-column header-align="center" align="center">
                            <el-table-column header-align="center" align="center">
                                <template #default="{ row, $index }">
                                    <input type="radio" :checked="row.firstRadio" disabled v-if="$index != 7" />
                                </template>
                            </el-table-column>
                            <el-table-column prop="conditions" header-align="center" align="left" width="200">
                            </el-table-column>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column prop="evaluationResult" label="修正系数Ci" header-align="center" align="center">
                        <el-table-column prop="evaluationResult" label="满足" header-align="center" align="center">
                            <el-table-column prop="secendeRadio" header-align="center" align="center">
                                <template #default="{ row, $index }">
                                    <input type="radio" :checked="row.secendeRadio" disabled />
                                </template>
                            </el-table-column>
                            <el-table-column prop="value1" header-align="center" align="center">
                            </el-table-column>
                        </el-table-column>
                        <el-table-column prop="evaluationResult" label="不满足" header-align="center" align="center">
                            <el-table-column prop="thirdRado" header-align="center" align="center">
                                <template #default="{ row, $index }">
                                    <input type="radio" :checked="row.thirdRado" disabled />
                                </template>
                            </el-table-column>
                            <el-table-column prop="value2" header-align="center" align="center">
                            </el-table-column>
                        </el-table-column>

                    </el-table-column>

                </el-table>
            </div>
            <template #footer>
                <div class="dialog-footer">
                    <el-button plain @click="close">取 消</el-button>
                </div>
            </template>
        </el-dialog>
    </div>
</template>

<script setup>
// 引入公式组件
import Formula from '@/components/Formula';
import MultilineFormula from '@/components/Formula/multiline';
const emits = defineEmits(['update:open'])
const props = defineProps({
    open: {
        type: Boolean,
        default: false
    },
    title: {
        type: String,
        default: ''
    }
})

const tableList = [
    { firstRadio: false, conditions: '（1）现浇钢筋混凝土构件沿高度断面无突变', secendeRadio: false, value1: 0, thirdRado: false, value2: 0.20, },
    { firstRadio: true, conditions: '（2）平面规则', secendeRadio: true, value1: 0, thirdRado: false, value2: 0.20, },
    { firstRadio: true, conditions: '（3）施工质量良好', secendeRadio: false, value1: 0, thirdRado: true, value2: 0.20, },
    { firstRadio: false, conditions: '（4）符合《建筑抗震设计规范》（GBJ 11-89）', secendeRadio: false, value1: -0.27, thirdRado: false, value2: 0, },
    { firstRadio: false, conditions: '（5）符合标准Tj 11-1978要求', secendeRadio: false, value1: -0.25, thirdRado: false, value2: 0, },
    { firstRadio: true, conditions: '（6）符合标准Tj 11-1974要求，但不符合标准Tj 11-1978要求', secendeRadio: true, value1: -0.2, thirdRado: false, value2: 0, },
    { firstRadio: false, conditions: '（7）符合《建筑抗震设计规范》（GB50011）', secendeRadio: true, value1: -0.27, thirdRado: false, value2: 0, },
    { firstRadio: '', conditions: '（8）其他', secendeRadio: true, value1: 0, thirdRado: false, value2: 0, },
]
const close = () => {
    emits('update:open', false)
}
const indexIcon = (index) => {
    return `&#${9312 + index};`
}
</script>

<style scoped lang="scss">
:deep(.el-table) {
    thead >:nth-child(3){
            display: none;
    }

}
</style>